<!DOCTYPE html>
<html lang="en">

<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
		<title>兴趣爱好</title>
		<link rel="stylesheet" href="../res/layui/css/layui.css">
		<link rel="stylesheet" href="../res/static/css/index.css">
    <style>
		
		.animate-area{
	position: absolute;
	top: 760px;
	width: 100%;
	height: 150px;
	overflow: hidden;
	background-image: url(../res/static/img/qiu2.png),url(../res/static/img/qiu.png),url(../res/static/img/yun.png);
	background-position: 120px 80px, 30px 150px,0px 80px;
	background-repeat: no-repeat, no-repeat, repeat-x;
	animation: animatedBird 4s linear infinite;
	-moz-animation: animatedBird 4s linear infinite;	/* Firefox */
	-webkit-animation: animatedBird 4s linear infinite;	/* Safari 和 Chrome */
	-o-animation: animatedBird 4s linear infinite;
	left: 9px;
		}
		 @keyframes animatedBird {
		from { background-position:120px 80px, 30px 150px, 0px 80px, 0 0; }
		to { background-position: 300px 0px, 50px 20px, -400px 80px, 100% 0; }/*--背景动画--*/
         }
	    body {
	background-color: #88769C;
}
    </style>
</head>
	<body>
		<!-- nav部分 -->
      	<div class="nav">
			<div class="layui-container">
			<div class="layui-container">
				<ul class="layui-nav" lay-filter="">
		          <li class="layui-nav-item"><a href="index.html">首页</a></li>
		          <li class="layui-nav-item"><a href="introduce.html">个人介绍</a></li>
		          <li class="layui-nav-item layui-this">兴趣爱好</li>
                   <li class="layui-nav-item ">
							<a href="school.html">学校</a>
						</li>
		        
		          <li class="layui-nav-item"><a href="ly.html">留言板</a></li>
		        </ul>
			  </div>
			</div>
		</div>
		<!-- banner部分 -->
		<div class="banner xsh">
			<div class="title">
				<p><strong>兴趣爱好</strong></p>
				<p class="en"><strong>Hobbies and Interests</strong></p>
			</div>
		</div>
		<div class="main-about">
		  <div class="layui-container">
				<div class="layui-row">
					<ul class="aboutab">
						<li><a href="music.html"><img src="../res/static/img/mao.jpg" width="61" height="56">音乐</a></li>
						<li><a href="cartoon.html"><img src="../res/static/img/mao.jpg" width="61" height="56">动漫</a></li>
					</ul>
				</div>
			</div>
		</div>
	<div class="animate-area" > </div>
    	<hr />
        
</body>

</html>